<!-- From Uiverse.io by SmookyDev  - Tags: simple, card, light, light&dark, box-shadow, tailwind -->
<div
  class="flex flex-col gap-1 justify-center items-start w-[280px] bg-white dark:bg-transparent px-4 py-4 shadow-xl rounded-lg"
>
  <p class="font-semibold text-xl text-gray-600 mb-2">Tags</p>
  <div class="flex flex-wrap gap-2">
    <p
      class="px-3 py-1 text-[12px] bg-[#d9dfe3] max-w-max rounded font-semibold text-[#7281a3]"
    >
      #uiverse
    </p>
    <p
      class="px-3 py-1 text-[12px] bg-[#d9dfe3] max-w-max rounded font-semibold text-[#7281a3]"
    >
      #html
    </p>

    <p
      class="px-3 py-1 text-[12px] bg-[#d9dfe3] max-w-max rounded font-semibold text-[#7281a3]"
    >
      #css
    </p>
    <p
      class="px-3 py-1 text-[12px] bg-[#d9dfe3] max-w-max rounded font-semibold text-[#7281a3]"
    >
      #tailwindcss
    </p>

    <p
      class="px-3 py-1 text-[12px] bg-[#d9dfe3] max-w-max rounded font-semibold text-[#7281a3]"
    >
      #hoverme
    </p>
    <p
      class="px-3 py-1 text-[12px] bg-[#d9dfe3] max-w-max rounded font-semibold text-[#7281a3]"
    >
      #figma
    </p>

    <p
      class="px-3 py-1 text-[12px] bg-[#d9dfe3] max-w-max rounded font-semibold text-[#7281a3]"
    >
      #card
    </p>
    <p
      class="px-3 py-1 text-[12px] bg-[#d9dfe3] max-w-max rounded font-semibold text-[#7281a3]"
    >
      #PSD
    </p>
  </div>
</div>


    